<template>
	<!-- 原始通用版本 -->
	<view>
		<!-- 头部搜索框 -->
		<search :placeholder="$t('homepage.ProductionMonitor.tieNo')" />
		<!-- 当日概况 -->
		<zy-group :title="$t('homepage.ProductionMonitor.todayGeneral')">
			<view class="overviewContainer">
				<view class="overviewContainer_content">
					<view class="overviewContainer_content_title">{{$t("homepage.ProductionMonitor.todayYield")}}
					</view>
					<text class="overviewContainer_content_text">{{todayYield | unitConverter}}
					</text>{{$("public.piece")}}
				</view>
				<view class="overviewContainer_content">
					<view class="overviewContainer_content_title">{{$("homepage.ProductionMonitor.scanNum")}}</view>
					<text class="overviewContainer_content_text">{{count | unitConverter}} </text>{{$("public.piece")}}
				</view>
			</view>
		</zy-group>
		<zy-popup ref="popup" :title="$t('public.detail')" type="dialog" :leftBtn="$t('public.cancel')"
			:rightBtn="$t('public.sure')" @cancel="cancel" @confirm="confirm">
			<zy-forms :model="formData" border labelWidth="120">
				<zy-form-item :label="$t('homepage.ProductionMonitor.htdocnumTitle')"><text
						class="formText">{{formData.saleOrderNo || $t('public.null')}}</text>
				</zy-form-item>
				<zy-form-item :label="$t('homepage.ProductionMonitor.productionNoTitle')"><text
						class="formText">{{formData.productionNo || $t('public.null')}}</text>
				</zy-form-item>
				<zy-form-item :label="$t('homepage.ProductionMonitor.bindingNoTitle')"><text
						class="formText">{{formData.bindingNo || $t('public.null')}}</text>
				</zy-form-item>
				<zy-form-item :label="$t('homepage.ProductionMonitor.partNameTitle')"><text
						class="formText">{{formData.partName || $t('public.null')}}</text>
				</zy-form-item>
				<zy-form-item :label="$t('homepage.ProductionMonitor.batchColorTitle')"><text
						class="formText">{{formData.color || $t('public.null')}}</text></zy-form-item>
				<zy-form-item :label="$t('homepage.ProductionMonitor.batchSizeTitle')"><text
						class="formText">{{formData.size || $t('public.null')}}</text></zy-form-item>
				<zy-form-item :label="$t('homepage.ProductionMonitor.batchNumTitle')"><text
						class="formText">{{formData.perBindNum || $t('public.null')}}</text>
				</zy-form-item>
				<zy-form-item :label="$t('homepage.ProductionMonitor.remarksTitle')"><text
						class="formText">{{formData.remarks || $t('public.null')}}</text></zy-form-item>
			</zy-forms>
		</zy-popup>
		<!-- 已生产工序 -->
		<zy-group :title="$t('homepage.ProductionMonitor.productedProcedure')">
			<zy-table :headList="headList" :dataList="dataList" border>
			</zy-table>
		</zy-group>
	</view>
</template>

<script>
	import {
		getTodayVo,
		findCardInfoByNo,
		queryListProcedure
	} from "@/api/homepage.js"
	export default {
		data() {
			return {
				show: true,
				title: this.$t('homepage.ProductionMonitor.procedureInfo'),
				todayYield: '', //当日产量
				count: '', //扫描件数
				//表格表头数据
				headList: [{
						name: this.$t('public.procedureCode'),
						key: 'procedureCode'
					},
					{
						name: this.$t('public.procedureName'),
						key: 'procedureName'
					}
				],
				dataList: [],
				//弹窗表单数据
				formData: {
					saleOrderNo: '',
					productionNo: '',
					partName: '',
					color: '',
					size: '',
					bindingNo: '',
					perBindNum: '',
					remarks: '',
				},
				detailDatas: [],
				detailIDDatas: []
			}
		},
		onLoad() {
			//PDA扫描
			var _this = this
			uni.$on('scancodedate', function(data) {
				_this.searchList(data.code)
			})
		},
		// 下拉刷新
		onPullDownRefresh() {
			setTimeout(function() {
				uni.redirectTo({
					url: "/pages/HomePage/ProductionMonitor/index"
				})
				uni.stopPullDownRefresh();
			}, 1000);
		},
		onUnload() {
			// 移除监听事件      
			uni.$off('scancodedate')
		},
		mounted() {
			this.getTodayVoData()
			this.getqueryList()
		},
		methods: {
			searchList(e) {
				findCardInfoByNo({
					cardNo: e,
					procedureId: this.detailDatas,
					billType: "0",
				}).then((res) => {
					if (res.code == 0) {
						this.$refs.popup.open()
						this.formData = res.data
						this.$store.commit('findCardInfoByNoList', this.formData)
					} else {
						uni.showToast({
							title: res.message,
							icon: "none",
							duration: 3000
						})
					}
				}).catch((res) => {
					uni.showToast({
						title: res.message,
						icon: "none",
						duration: 3000
					})
				});
			},
			//当日概况
			getTodayVoData() {
				getTodayVo().then((res) => {
					this.todayYield = res.data.todayYield, //当天产量
						this.count = res.data.count //扫描件数
				})
			},
			//已生产工序表格
			getqueryList() {
				getTodayVo().then((res) => {
					if (res.code == 0) {
						this.dataList = res.data.listMap
						this.detailDatas = [];
						this.detailIDDatas = [];
						for (var j = 0; j < this.dataList.length; j++) {
							const procedureId = this.dataList[j].procedureId
							this.detailDatas.push(procedureId);
							this.$store.commit('procedureIdList', this.detailDatas)
							const procedureName = this.dataList[j].procedureName
							this.detailIDDatas.push(procedureName);
							this.$store.commit('procedureNameList', this.detailIDDatas)
						}
					} else {
						uni.showToast({
							title: res.message,
							icon: "none",
							duration: 3000
						})
					}
				}).catch((res) => {
					uni.showToast({
						title: res.message,
						icon: "none",
						duration: 3000
					})
				});
			},
			//弹出层取消，重置页面
			cancel() {
				uni.redirectTo({
					url: "/pages/HomePage/ProductionMonitor/index"
				})
			},
			//弹出层提交
			confirm() {
				uni.navigateTo({
					url: "./InfoSubmit/index?formData=" + this.formData
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.overviewContainer {
		display: flex;
		width: 100%;
		height: 180rpx;
	}

	.overviewContainer_content {
		width: 50%;
		text-align: center;
		margin: auto;
	}

	.overviewContainer_content_title {
		font-size: 36rpx;
		font-weight: bold;
		margin-bottom: 20rpx;
	}

	.overviewContainer_content_text {
		color: #ff0000;
		padding: 5rpx;
	}

	.formText {
		color: #999;
	}
</style>